<!-- 正文开始 -->
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body text-center">
            <br><br>
            <button id="btnPrint1" class="layui-btn">竖屏打印</button>
            <button id="btnPrint2" class="layui-btn">横屏打印</button>
            <br><br>
            <button id="btnPrint5" class="layui-btn">打印主体部分</button>
            <button id="btnPrint3" class="layui-btn">打印自定义内容</button>
            <button id="btnPrint4" class="layui-btn">分页打印</button>
            <br><br>
            <br><br>
            <div class="hide-print">
                此段内容会在打印时自动隐藏。
            </div>
            <br><br>
        </div>
    </div>
</div>
<script>
    layui.use(['layer', 'printer'], function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var printer = layui.printer;

        // 打印当前页面
        $('#btnPrint1').click(function () {
            printer.print();
        });
        $('#btnPrint2').click(function () {
            printer.print({
                horizontal: true  // 横向打印
            });
        });

        // 打印任意html字符串
        $('#btnPrint3').click(function () {
            var htmlStr = printer.makeHtml({
                style: '<style>*{color: red;text-align: center;}</style>',
                body: 'Hello Word !'
            });
            printer.printHtml({
                html: htmlStr,
                horizontal: true,  // 横向打印
                close: false  // 自动关闭打印窗口
            });
        });

        // 分页打印
        $('#btnPrint4').click(function () {
            printer.printPage({
                htmls: [
                    '<div>我是第一页</div>',
                    '<div>我是第二页</div>',
                    '<div>我是第三页</div>',
                    '<div>我是第四页</div>',
                    '<div>我是第五页</div>'
                ],
                style: '<style>*{color: red;}</style>',  // 页面样式
                horizontal: true,  // 是否横向
                padding: undefined, // 页边距
                debug: true,  // 调试模式
                close: false  // 自动关闭打印窗口
            });
        });

        // 打印主体内容部分
        $('#btnPrint5').click(function () {
            var style = '<link rel="stylesheet" href="./assets/libs/layui/css/layui.css">';
            style += '   <link rel="stylesheet" href="./assets/module/admin.css">';
            style += '   <script type="text/javascript" src="./assets/libs/layui/layui.js"><\/script>';
            var htmlStr = printer.makeHtml({
                style: style,
                body: $('div[lay-id="/plugin/printer"]>.layui-fluid')[0].outerHTML
            });
            printer.printHtml({
                html: htmlStr,
                horizontal: true,  // 横向打印
                close: false  // 自动关闭打印窗口
            });
        });

    });
</script>